/**
 * 是一个可选的配置文件，如果项目的 (和 package.json 同级的) 根目录中存在这个文件，那么它会被 @vue/cli-service 自动加载
 */
let path = require('path')
const webpack = require('webpack')

const ThemeColorReplacer = require('webpack-theme-color-replacer')
const { getThemeColors, modifyVars } = require('./src/utils/themeUtil')
const { resolveCss } = require('./src/utils/theme-color-replacer-extend')
const CompressionWebpackPlugin = require('compression-webpack-plugin')

const productionGzipExtensions = ['js', 'css']
const isProd = process.env.NODE_ENV === 'production'

const assetsCDN = {
  // webpack build externals
  externals: {
    vue: 'Vue',
    'vue-router': 'VueRouter',
    vuex: 'Vuex',
    axios: 'axios',
    nprogress: 'NProgress',
    clipboard: 'ClipboardJS',
    '@antv/data-set': 'DataSet',
    'js-cookie': 'Cookies'
  },
  css: [
  ],
  // js: [
  //   '//cdn.jsdelivr.net/npm/vue@2.6.11/dist/vue.min.js',
  //   '//cdn.jsdelivr.net/npm/vue-router@3.3.4/dist/vue-router.min.js',
  //   '//cdn.jsdelivr.net/npm/vuex@3.4.0/dist/vuex.min.js',
  //   '//cdn.jsdelivr.net/npm/axios@0.19.2/dist/axios.min.js',
  //   '//cdn.jsdelivr.net/npm/nprogress@0.2.0/nprogress.min.js',
  //   '//cdn.jsdelivr.net/npm/clipboard@2.0.6/dist/clipboard.min.js',
  //   '//cdn.jsdelivr.net/npm/@antv/data-set@0.11.4/build/data-set.min.js',
  //   '//cdn.jsdelivr.net/npm/js-cookie@2.2.1/src/js.cookie.min.js'
  // ]
}

const timestamp = new Date().getTime();
module.exports = {
  // publicPath: process.env.NODE_ENV === 'production' ? './' : '/', //部署到服务器用./
  publicPath:'/',
  outputDir: 'dist', // 打包的目录
  assetsDir: 'assets',
  lintOnSave: true, // 在保存时校验格式,undefined
  productionSourceMap: false, // 生产环境是否生成 SourceMap，不生成.map文件
  // babel-loader no-ignore node_modules/*
  transpileDependencies: [],

  devServer: {
    open: true, // 启动服务后是否打开浏览器
    host: '0.0.0.0',
    // port: 2022, // 服务端口
    https: false,// 开启https访问
    hotOnly: false,// 是否开启热更新
    // before: app => { },
    // 设置代理
    // proxy: {
    //   'api/login': {
    //     target: 'http://127.0.0.1:2022',  //本地
    //     // target: 'http://qd-spc.dev.huawei.com/', 
    //     changeOrigin: true // 是够跨域，虚拟的站点需要更管origin  pathRewrite: {'^/ailis': '/'}
    //   },
    //   'api/sysDic': {
    //     target: 'http://127.0.0.1:2022',  //本地
    //     // target: 'http://qd-spc.dev.huawei.com/',   
    //     changeOrigin: true // 是够跨域，虚拟的站点需要更管origin  pathRewrite: {'^/ailis': '/'}
    //   },
    //   '/api/projects': {
    //     target: 'http://192.168.1.207:9000',  //本地
    //     // target: 'http://qd-spc.dev.huawei.com/',   
    //     changeOrigin: true // 是够跨域，虚拟的站点需要更管origin  pathRewrite: {'^/ailis': '/'}
    //   },
    //   '/api': { //此处要与 /services/api.js 中的 API_PROXY_PREFIX 值保持一致
    //     target: process.env.VUE_APP_API_BASE_URL,
    //     changeOrigin: true,
    //     pathRewrite: {
    //       '^/api': ''
    //     }
    //   }
    // }
  },
  pluginOptions: {
    'style-resources-loader': {
      preProcessor: 'less',
      patterns: [path.resolve(__dirname, "./src/theme/theme.less")],
    }
  },
  configureWebpack: config => {
    // config.devtool = 'source-map'
    // config.output = { // 输出重构  打包编译后的 文件名称  【模块名称.时间戳】
    //   filename: `[name].${timestamp}.js`,
    //   chunkFilename: `[name].${timestamp}.js`
    // }
    // config.entry.app = ["babel-polyfill", "whatwg-fetch", "./src/main.js"];
    config.performance = {
      hints: false
    }
    config.plugins.push(
      new ThemeColorReplacer({
        fileName: 'css/theme-colors-[contenthash:8].css',
        matchColors: getThemeColors(),
        injectCss: true,
        resolveCss
      })
    )
    // Ignore all locale files of moment.js
    config.plugins.push(new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/))
    // 生产环境下将资源压缩成gzip格式
    if (isProd) {
      // add `CompressionWebpack` plugin to webpack plugins
      config.plugins.push(new CompressionWebpackPlugin({
        algorithm: 'gzip',
        test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'), // 匹配文件名
        threshold: 10240, // 对超过10k的数据压缩
        minRatio: 0.8 // 压缩比
      }))
    }
    // if prod, add externals
    // if (isProd) {
    //   config.externals = assetsCDN.externals
    // }
  },
  chainWebpack: config => {
    config.resolve.alias
      .set('@$', path.join(__dirname, 'src')) // @后面可以跟其他参数@xxx都代表src下面
      .set('_c', path.join(__dirname, 'src/components'))

    // 生产环境下关闭css压缩的 colormin 项，因为此项优化与主题色替换功能冲突
    if (isProd) {
      config.plugin('optimize-css')
        .tap(args => {
          args[0].cssnanoOptions.preset[1].colormin = false
          return args
        })
    }
    // 生产环境下使用CDN
    if (isProd) {
      config.plugin('html')
        .tap(args => {
          args[0].cdn = assetsCDN
          return args
        })
    }
  },
  css: {
    loaderOptions: {
      less: {
        lessOptions: {
          modifyVars: modifyVars(),
          javascriptEnabled: true
        }
      }
    }
  },
}